<template>
  <div
    class="s_magnet"
    id="test_magnet"
    v-magnet="{ magnetEl: ['magnet'], magnet: {} }"
  ></div>
  <div class="magnet" id="magnet"></div>
  <div id="magnet1"></div>
  <div class="drag_t" v-drag></div>
</template>

<script setup>
import { magnetFunc } from './vMagnet';
import { extendMagnetDataInfo } from './v_m_gravitation';
import { onMounted } from 'vue';
onMounted(() => {});
let vMagnet = {
  mounted(el, bind) {
    magnetFunc(el, bind);
    extendMagnetDataInfo(bind['value']);
  },
};
</script>

<style scoped lang="scss">
.s_magnet {
  position: absolute;
  width: 50px;
  height: 90px;
  background-color: #f36d98;
}
.magnet {
  position: absolute;

  width: 900px;
  height: 600px;
  background-color: #564397;

  left: 60px;
  top: 100px;
  //   transform: translate(-50%, -50%);
}
</style>

<style></style>
